<template>
  <div>
    <!--搜索-->
    <el-form :model="queryParams" ref="queryParams" :inline="true">
      <el-form-item label="姓名" prop="studentName">
        <el-input v-model="queryParams.studentName" placeholder="请输入学生姓名"
                  clearable size="small" @keyup.enter.native="getExamTotalScore"/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="getExamTotalScore">搜索</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="warning" icon="el-icon-download" size="mini" @click="exportTable">导出</el-button>
      </el-col>
    </el-row>

    <el-table :data="totalScoreData" v-loading="loading" height="600px" ref="table">
      <el-table-column label="学号" align="center" prop="studentNo"/>
      <el-table-column label="姓名" align="center" prop="studentName"/>
      <el-table-column label="专业课总成绩" align="center" prop="majorTotalScore" sortable/>
      <el-table-column label="公共课总成绩" align="center" prop="publicTotalScore" sortable/>
      <el-table-column label="考试总成绩" align="center" prop="totalScore" sortable/>
    </el-table>
  </div>
</template>

<script>
  import { getExamTotalScore } from '@/api/exam/exam'

  export default {
    name: "classTotalScoreCount",
    props: ["examId","classId"],
    data() {
      return {
        // 遮罩层
        loading: true,
        // 查询参数
        queryParams: {
          studentName: ''
        },
        // 总分数据
        totalScoreData: []
      }
    },
    created() {
      this.getExamTotalScore();
    },
    methods: {
      //根据考试id,班级id获取学生总成绩记录
      getExamTotalScore() {
        this.loading = true;
        getExamTotalScore(this.classId,this.examId,this.queryParams).then(res=> {
          this.loading = false;
          this.totalScoreData = res.data;
        }).catch(err=> {
          console.log("err",err);
          this.loading = false;
        })
      },
      // 导出表格
      exportTable() {
        // 提取表头信息
        const headers = this.$refs.table.columns.map(column => column.label);
        const data = this.totalScoreData.map(item =>
          this.$refs.table.columns.map(column => item[column.property])
        );
        // 创建工作表
        const worksheet = this.$XLSX.utils.aoa_to_sheet([headers, ...data]);
        const workbook = this.$XLSX.utils.book_new();
        this.$XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
        this.$XLSX.writeFile(workbook, '班级总成绩.xlsx');
      }
    }
  }
</script>

<style scoped>

</style>
